<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>SSE Demo</title>
</head>
<body>
    <div id="msgFromPush"></div>
    <script type="text/javascript" src="../../plugin/jquery-3.3.1.js"></script>
    <script type="text/javascript">

        if(window.EventSource){
            var eventSource = new EventSource("../../../push");
            s = '';
            //只要和服务器连接，就会触发open事件
            eventSource.addEventListener("open",function(){
                console.log("和服务器建立连接");
                s += "和服务器建立连接"+"<br/>";
                $("#msgFromPush").html(s);
            });
            //处理服务器响应报文中的load事件
            eventSource.addEventListener("load",function(e){
                console.log("load:服务器发送给客户端的数据为:" + e.data);
                s += "load:服务器发送给客户端的数据为:"+ e.data+"<br/>";
                $("#msgFromPush").html(s);
            });
            //如果服务器响应报文中没有指明事件，默认触发message事件
            eventSource.addEventListener("message",function(e){
                s += "message:服务器发送给客户端的数据为:"+ e.data+"<br/>";
                $("#msgFromPush").html(s);  //原始是只有此处有
                console.log("message:服务器发送给客户端的数据为:" + e.data);
            });
            //发生错误，则会触发error事件
            eventSource.addEventListener("error",function(e){
                console.log("error:服务器发送给客户端的数据为:" + e.data);
                s += "error:服务器发送给客户端的数据为:"+ e.data+"<br/>";
                $("#msgFromPush").html(s);
            });

        }
        else{
            console.log("服务器不支持EvenSource对象");
        }
    </script>


    <!--<script type="text/javascript">-->
        <!--if (!!window.EventSource){-->
            <!--var source = new EventSource('../../../push');-->
            <!--alert(0);-->
            <!--s = '';-->
            <!--source.addEventListener('message',function (e) {-->
                <!--alert(1);-->
                <!--s += e.data+"<br/>";-->
                <!--$("#msgFromPush").html(s);-->
            <!--});-->
            <!--source.addEventListener('open',function (e) {-->
                <!--alert(2);-->
                <!--console.log("连接打开.");-->
            <!--},false);-->
            <!--source.addEventListener('error',function (e) {-->
                <!--alert(3);-->
                <!--if (e.readyState == EventSource.CLOSE){-->
                    <!--console.log("连接关闭");-->
                <!--}else {-->
                    <!--console.log(e.readyState);-->
                <!--}-->
            <!--},false);-->
        <!--}else {-->
            <!--console.log("你的浏览器不支持sse");-->
        <!--}-->
    <!--</script>-->

</body>
</html>